<template>
  <div id="app"  class="counter-warp">

    <!-- <canvas canvas-id="pieCanvas" disable-scroll="true" class="canvas"></canvas>
    <canvas canvas-id="ringCanvas" disable-scroll="true" class="canvas canvas2"></canvas> -->
    <canvas canvas-id="lineCanvas" disable-scroll="true" class="canvas"></canvas>
    <!-- <canvas canvas-id="columnCanvas" disable-scroll="true" class="canvas"></canvas>
    <canvas canvas-id="areaCanvas" disable-scroll="true" class="canvas"></canvas>
    <canvas canvas-id="radarCanvas" disable-scroll="true" class="canvas canvas2"></canvas> -->

    <mptoast />

  </div>
</template>

<script>
import mptoast from 'mptoast'
import { requestPost } from '@/utils/index'
export default {
  components: {
    mptoast
  },
  data () {
    return {
      imageWidth: 0,
      windowW: 0,
      categories: '',
      dataa: '',
      tid: 0
    }
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad () {

    this.tid = this.$root.$mp.query.id
    wx.setNavigationBarTitle({
      title: 'TOPIC 七日走势'
    })
    // 屏幕宽度
    this.imageWidth = wx.getSystemInfoSync().windowWidth
    // console.log(this.imageWidth);
    //计算屏幕宽度比列
    this.windowW = this.imageWidth/375;
    // console.log(this.windowW);
  },
  onShow () {
    this.updateremark ()
  },
  methods: {
    updateremark () {
      // 路径是wxCharts文件相对于本文件的相对路径
      var wxCharts = require('@/utils/wxcharts');
      var that = this
      var data = {
        "pageNo": "1",
        "rowCount": 30,
        "obj": {
          "topicid": that.tid
        }
      }

      requestPost(wx.getStorageSync('requestUrl') + '/wxsys/getTopicReportInWeek', data, 'POST').then(function (value) {

        that.dataa = value.data.data;
        that.categories = value.data.categories;
        new wxCharts({
          canvasId: 'lineCanvas',
          type: 'line',
          categories: that.categories,
          series: [{
              name: '消息量',
              data: that.dataa,
              format: function (val) {
                return val.toFixed(2) + '条';
              }
          }],
          yAxis: {
              title: '消息生产数量(条)',
              format: function (val) {
                  return val.toFixed(2);
              },
              min: 0
          },
          width: 320,
          height: 200
        })
      }, function (value) {
        console.log(value)
      })

    }
  }
}
</script>

<style>

.canvas {
    width: 750rpx;
    height: 500rpx;
}
</style>




